cypress/e2e/facility_spec/FacilityManage.cy.ts (2)

131-133: LGTM! Consider adding a test for the enabled state.

The changes correctly verify that the submit button is initially disabled. However, to make the test more comprehensive, consider also verifying that the button becomes enabled after making changes.

 cy.get('button[type="submit"]').should("be.disabled");
 facilityPage.fillDoctorCount(doctorModifiedCapacity);
+cy.get('button[type="submit"]').should("be.enabled");
 facilityPage.saveAndExitDoctorForm();

---

161-164: LGTM! Consider adding a test for the enabled state for consistency.

Similar to the doctor capacity section, consider verifying that the button becomes enabled after making changes to ensure consistent test coverage across both forms.

 cy.get('button[type="submit"]').should("be.disabled");
 facilityPage.fillTotalCapacity(totalUpdatedCapacity);
 facilityPage.fillCurrentlyOccupied(currentUpdatedOccupied);
+cy.get('button[type="submit"]').should("be.enabled");
 facilityPage.saveAndExitBedCapacityForm();

Configuration used: CodeRabbit UI
Review profile: CHILL

Learnt from: Jacobjeevan
PR: ohcnetwork/care_fe#9145
File: cypress/e2e/facility_spec/FacilityCreation.cy.ts:177-180
Timestamp: 2024-11-18T10:44:30.303Z
Learning: In `cypress/e2e/facility_spec/FacilityCreation.cy.ts`, when testing bed and staff capacity individually for additional error verification, we prefer to use separate method calls to handle bed and staff capacity, rather than using `facilityPage.createNewFacility(testFacilityData)` which also handles bed management.

Learnt from: kihan2518B
PR: ohcnetwork/care_fe#8956
File: cypress/e2e/facility_spec/FacilityCreation.cy.ts:261-261
Timestamp: 2024-12-04T18:58:47.241Z
Learning: In `cypress/e2e/facility_spec/FacilityCreation.cy.ts`, the test case titled "Create a new facility with no bed and doctor capacity" includes steps to select bed types and specializations before validation. This is done intentionally to verify that error messages are shown properly when no capacity is specified.

Learnt from: Jacobjeevan
PR: ohcnetwork/care_fe#9145
File: cypress/e2e/facility_spec/FacilityHomepage.cy.ts:229-317
Timestamp: 2024-11-18T10:46:56.271Z
Learning: In `cypress/e2e/facility_spec/FacilityHomepage.cy.ts`, when verifying the bed capacity badge reflection, the badge remains the same during multiple actions and only updates after a bed is attached to a patient during consultation. Therefore, it's appropriate to keep the test case consolidated rather than splitting it into smaller tests.

src/components/Form/Form.tsx (1)

26-43: Consider improving type safety of Props interface.

The Props interface could benefit from stronger typing:

1. The source parameter in onSubmit should be constrained to valid button IDs
2. The submitBtnId should be required when additionalButtons is provided

type Props<T extends FormDetails> = {
-  onSubmit: (form: T, source?: string) => Promise<FormErrors<T> | void>;
+  onSubmit: (form: T, source?: 'submit' | string) => Promise<FormErrors<T> | void>;
   submitBtnId?: string;
-  additionalButtons?: {
+  additionalButtons?: Array<{
     type: "submit" | "button";
     label: string;
     id: string;
-  }[];
+  }>;
};

🧰 Tools

🪛 Biome (1.9.4)

[error] 26-26: void is confusing inside a union type.

Unsafe fix: Use undefined instead.

(lint/suspicious/noConfusingVoidType)

src/components/Facility/StaffCapacity.tsx (1)

160-165: Improve error handling in API calls.

The error handling could be enhanced with more specific error messages and proper error typing.

 } catch (error) {
+  const errorMessage = error instanceof Error ? error.message : "Unknown error";
   Notification.Error({
-    msg: "Failed to update staff capacity",
+    msg: t("staff_capacity_update_failed", { error: errorMessage }),
   });
 }

src/components/Facility/BedCapacity.tsx (1)

244-309: Consider improving form field type safety.

The form field event handlers use any type which could lead to runtime errors.

-onChange={(e: any) => field("bedType").onChange(e)}
+onChange={(e: { name: string; value: string }) => field("bedType").onChange(e)}

-onChange={(e: any) => field("totalCapacity").onChange(e)}
+onChange={(e: { name: string; value: string }) => field("totalCapacity").onChange(e)}

-onChange={(e: any) => field("currentOccupancy").onChange(e)}
+onChange={(e: { name: string; value: string }) => field("currentOccupancy").onChange(e)}

src/components/Resource/ResourceDetailsUpdate.tsx (1)

Line range hint 133-173: Consider extracting resource data construction to a separate function.

The resource data construction logic could be extracted into a separate function for better maintainability and reusability.

Consider applying this refactor:

+ const constructResourceData = (form: typeof initForm, resourceDetails: any) => ({
+   category: "OXYGEN",
+   status: form.status,
+   origin_facility: form.origin_facility_object?.id,
+   approving_facility: form?.approving_facility_object?.id,
+   assigned_facility: form?.assigned_facility_object?.id,
+   emergency: [true, "true"].includes(form.emergency),
+   title: form.title,
+   reason: form.reason,
+   assigned_to: form.assigned_to,
+   requested_quantity: form.requested_quantity || 0,
+   assigned_quantity: form.status === "PENDING"
+     ? form.assigned_quantity
+     : resourceDetails?.assigned_quantity || 0,
+ });

  const handleSubmit = async (form: typeof initForm) => {
    const validForm = validateForm(form);

    if (validForm) {
      setIsLoading(true);
-     const resourceData = {
-       category: "OXYGEN",
-       status: form.status,
-       // ... rest of the construction
-     };
+     const resourceData = constructResourceData(form, resourceDetails);

src/components/Shifting/ShiftDetailsUpdate.tsx (1)

Line range hint 174-246: Consider extracting discharge handling logic.

The discharge handling logic could be extracted into a separate function to improve readability and maintainability.

Consider this refactor:

+ const handleDischarge = (form: typeof initForm, setDischargeReason: Function, setShowDischargeModal: Function) => {
+   if (form.status === "PATIENT EXPIRED") {
+     setDischargeReason(DISCHARGE_REASONS.find((i) => i.text == "Expired")?.id);
+     setShowDischargeModal(true);
+     return true;
+   }
+   if (form.status === "COMPLETED") {
+     setDischargeReason(DISCHARGE_REASONS.find((i) => i.text == "Referred")?.id);
+     setShowDischargeModal(true);
+     return true;
+   }
+   return false;
+ };

  const handleSubmit = async (form: typeof initForm, source?: string, discharged = false) => {
    const validForm = validateForm(form);

    if (validForm) {
-     if (!discharged && form.status === "PATIENT EXPIRED") {
-       // ... discharge logic
-     }
-     if (!discharged && form.status === "COMPLETED") {
-       // ... discharge logic
-     }
+     if (!discharged && handleDischarge(form, setDischargeReason, setShowDischargeModal)) {
+       return;
+     }

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

Learnt from: Jacobjeevan
PR: ohcnetwork/care_fe#8956
File: src/components/Shifting/ShiftDetailsUpdate.tsx:348-370
Timestamp: 2024-12-11T01:32:56.923Z
Learning: In the `ShiftDetailsUpdate` component (`src/components/Shifting/ShiftDetailsUpdate.tsx`), the field `approving_facility` is not required in `initForm`.

Learnt from: kihan2518B
PR: ohcnetwork/care_fe#8956
File: src/components/Patient/PatientRegister.tsx:861-861
Timestamp: 2024-12-02T18:50:29.685Z
Learning: In `src/components/Patient/PatientRegister.tsx`, `insuranceDetails` is not part of `state.form`, so changes to it are not tracked by the `isDirty` state. Therefore, the form's `disabled` state needs to be conditionally set based on `insuranceDetails.length`.

-      {...(insuranceDetails.length > 0 ? { disabled: false } : {})}
+      disabled={!isDirty && !hasInsuranceChanges}

const [hasInsuranceChanges, setHasInsuranceChanges] = useState(false);

// Update the insurance details change handler
const handleInsuranceDetailsChange = ({ value }: { value: HCXPolicyModel[] }) => {
  setInsuranceDetails(value);
  setHasInsuranceChanges(true);
};

-  onChange={({ value }) => setInsuranceDetails(value)}
+  onChange={handleInsuranceDetailsChange}

Learnt from: kihan2518B
PR: ohcnetwork/care_fe#8956
File: src/components/Patient/PatientRegister.tsx:861-861
Timestamp: 2024-12-02T18:50:29.685Z
Learning: In `src/components/Patient/PatientRegister.tsx`, `insuranceDetails` is not part of `state.form`, so changes to it are not tracked by the `isDirty` state. Therefore, the form's `disabled` state needs to be conditionally set based on `insuranceDetails.length`.

 const handleFieldChange = (
   { name, value }: FieldChangeEvent<T[keyof T]>,
   validate?: FieldValidator<T[keyof T]>,
 ) => {
   dispatch({
     type: "set_field",
     name,
     value,
     error: validate?.(value),
   });

   const defaultValue: unknown = props.defaults[name];
-  const isEqual = (() => {
-    // Handle null/undefined
-    if (defaultValue === null || value === null) {
-      return defaultValue === value;
-    }
-    
-    // Handle arrays
-    if (Array.isArray(defaultValue) && Array.isArray(value)) {
-      return JSON.stringify(defaultValue) === JSON.stringify(value);
-    }
-    
-    // Handle objects
-    if (typeof defaultValue === "object" && typeof value === "object") {
-      return JSON.stringify(defaultValue) === JSON.stringify(value);
-    }
-    
-    // Handle number/string conversion
-    if (typeof defaultValue === "number" && typeof value === "string") {
-      return defaultValue.toString() === value;
-    }
-    
-    // Default case
-    return defaultValue === value;
-  })();
+  const isEqual = (() => {
+    if (defaultValue === null || value === null) {
+      return defaultValue === value;
+    }
+    
+    if (Array.isArray(defaultValue) && Array.isArray(value)) {
+      return defaultValue.length === value.length && 
+             defaultValue.every((v, i) => value[i] === v);
+    }
+    
+    if (typeof defaultValue === "number" && typeof value === "string") {
+      const numValue = Number(value);
+      return !Number.isNaN(numValue) && defaultValue === numValue;
+    }
+    
+    if (typeof defaultValue === "object" && typeof value === "object") {
+      try {
+        return JSON.stringify(defaultValue) === JSON.stringify(value);
+      } catch {
+        return false;
+      }
+    }
+    
+    return defaultValue === value;
+  })();
   setIsDirty(!isEqual);
 };

+ interface FacilityObject {
+   id: string;
+   name: string;
+ }

- setSelected={(obj: any) => {
+ setSelected={(obj: FacilityObject) => {

-        validForm = true;
+        validForm = false;

src/components/Facility/BedCapacity.tsx (3)

Line range hint 1-20: Maintain consistent import paths

For better maintainability and consistency with the codebase, switch all imports to use absolute paths with the @/ prefix.

-import { useEffect, useReducer, useState } from "react";
-import { useTranslation } from "react-i18next";
+import { useEffect, useReducer, useState } from '@/node_modules/react';
+import { useTranslation } from '@/node_modules/react-i18next';

---

Line range hint 161-209: Enhance type safety in handleSubmit function

The function uses loose typing with any in several places. Consider adding proper type definitions for better type safety and maintainability.

-const handleSubmit = async (form: typeof initForm, source?: string) => {
+type SubmitSource = 'bed-capacity-save' | 'bed-capacity-save-and-exit';
+interface BedCapacityForm {
+  bedType: string;
+  totalCapacity: string;
+  currentOccupancy: string;
+}
+const handleSubmit = async (form: BedCapacityForm, source?: SubmitSource) => {

---

244-309: Enhance form accessibility

While the form has good accessibility features, consider adding ARIA labels and descriptions for better screen reader support.

 <TextFormField
   className="w-full"
   id="total-capacity"
   name="totalCapacity"
   label="Total Capacity"
+  aria-description={t("total_capacity_help_text")}
   required
   type="number"
   value={field("totalCapacity").value}
   onChange={(e: any) => field("totalCapacity").onChange(e)}
   error={state.errors.totalCapacity}
   min={1}
 />

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

 const validateData = (form: typeof initForm) => {
   const errors = { ...initForm };
   let validForm = true;
   Object.keys(form).forEach((field) => {
     if (!form[field]) {
       errors[field] = t("field_required");
       validForm = false;
     } else if (field === "currentOccupancy") {
-      if (Number(form[field] < 0)) {
+      const occupancy = Number(form[field]);
+      if (!Number.isNaN(occupancy)) {
+        if (occupancy < 0) {
-          errors[field] = "Occupied cannot be negative";
+          errors[field] = t("occupied_cannot_be_negative");
           validForm = false;
-        } else if (Number(form[field]) > Number(form.totalCapacity)) {
+        } else if (occupancy > Number(form.totalCapacity)) {
-          errors[field] = "Occupied must be less than or equal to total capacity";
+          errors[field] = t("occupied_exceeds_capacity");
           validForm = false;
         }
-      } else if (isNaN(Number(form[field]))) {
+      } else {
-        errors[field] = "Only numbers are allowed";
+        errors[field] = t("only_numbers_allowed");
         validForm = false;
       }
     } else if (field === "totalCapacity") {
-      if (Number(form[field]) === 0) {
+      const capacity = Number(form[field]);
+      if (!Number.isNaN(capacity)) {
+        if (capacity === 0) {
-          errors[field] = "Total capacity cannot be 0";
+          errors[field] = t("capacity_cannot_be_zero");
           validForm = false;
-        } else if (Number(form[field]) < 0) {
+        } else if (capacity < 0) {
-          errors[field] = "Total capacity cannot be negative";
+          errors[field] = t("capacity_cannot_be_negative");
           validForm = false;
         }
-      } else if (isNaN(Number(form[field]))) {
+      } else {
-        errors[field] = "Only numbers are allowed";
+        errors[field] = t("only_numbers_allowed");
         validForm = false;
       }
     }
   });